<template>
	<view>
		<view class="background"></view>
		<view class="recordList">
			<view class="recordListItem" v-for="(item,index) in recordList" :key="index">
				<view class="ItemHeader">
					<view class="title">
						{{ item.typeName }}
					</view>
					<view class="date">
						{{ item.time }}
					</view>
				</view>
				<view class="ItemBody">
					<view>
						订单编号：<text>{{ item.id }}</text>
					</view>
					<view v-if="item.typeName == '拖车'">
						<view>起点：{{ item.position }}</view>
						<view>终点：{{ item.end }}</view>
					</view>
					<view v-else>
						位置：<text>{{ item.position }}</text>
					</view>
					<view>
						车牌：<text>{{ item.carNum }}</text>
					</view>
					<view v-if="item.status == 1">
						商家名称：<text>{{ item.shopName }}</text>
					</view>
					<view v-if="item.status == 1">
						联系电话：<text>{{ item.shopMobile }}</text>
					</view>
					<view class="status">
						<view v-if="item.status == 0">
							求助中
						</view>
						<view v-if="item.status == 1">
							已接单
						</view>
						<view v-if="item.status == 2">
							超时取消
						</view>
						<view v-if="item.status == 3">
							已完成
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				recordList: [],
				shopList:'',
				loginUser:'',
			}
		},
		methods: {
			// 获取救援记录
			getRescueList(){ 
				console.log(this.loginUser.id)
				this.$request({
					url: 'cfuser/rescue/task/list/'+this.loginUser.id,
					method: 'GET',
					success:(res)=>{
						let list = res.data.data
						if(res.data.code == 200){
							if(list.length > 0){
								for(let i = 0; i < list.length; i++){
									let index = list[i].indexOf("id")
									let id = list[i].substring(index+4,index+23)
									let info = JSON.parse(list[i])
									info.id = id
									this.recordList.unshift(info)
								}
								console.log("--------")
								console.log(this.recordList)
							}else{
								uni.showToast({
									title: "没有救援记录",
									duration: 2000,
									icon: 'none'
								});
							}
							
						}
					}
				})
			},
			onLoad(options){
				this.loginUser = uni.getStorageSync("cfuser"),
				this.getRescueList()
				console.log("-----------")
				console.log(options)
			},
		}
	}
</script>

<style>
	page {
		background-color: #f0f0f0;
	}
	.background {
		width: 750rpx;
		height: 280rpx;
		background-color: #2979ff;
	}
	.recordList {
		position: absolute;
		width: 710rpx;
		padding: 0 20rpx;
		padding-bottom: 40rpx;
		top: 0;
	}
	.recordListItem {
		margin-top: 20rpx;
		background-color: white;
		padding: 20rpx 20rpx;
		border-radius: 20rpx;
	}
	.recordListItem > .ItemHeader {
		display: flex;
		width: 670rpx;
		padding: 10rpx 0;
		margin-bottom: 20rpx;
		justify-content: space-between;
		border-bottom: 6rpx solid #f0f0f0;
	}
	.ItemHeader > .title {
		color: #2979ff;	
	}
	.ItemHeader > .date {
		font-size: 20rpx;
		color: #6a6a6a;
	}
	.ItemBody {
		position: relative;
		padding-bottom: 50rpx;
	}
	.ItemBody > view {
		min-height: 60rpx;
		line-height: 60rpx;
		color: #3a3a3a;
		/* border: 2rpx solid red; */
	}
	.ItemBody text {
		color: #6a6a6a;
	}
	.ItemBody > .status{
		position: absolute;
		right: 0;
		color: red;
	}
</style>
